<template>
  <!--  <div class="none">-->
  <!--     该商户不存在-->
  <!--  </div>-->
  <table cellspacing="0" cellpadding="0">
    <tr>
      <td>
        <table cellspacing="0" cellpadding="0">
          <tr>
            <td>
              <h2 style="color: darkred">{{msg}}</h2>
              <h3>出错啦！</h3>
              <p>错误码：{{code}}</p>
              <br/>
              <a style="text-decoration:underline" id="go_back" v-if=show_go_back>{{goto_time}} 秒后自动返回:</a>
              <a style="color: #2440b3" @click="go_index()">点击返回首页</a>
            </td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
</template>

<script>
</script>

<style lang="less" scoped>
* {
  font-family: "Microsoft Yahei";
  margin: 0;
  font-weight: lighter;
  text-decoration: none;
  text-align: center;
  line-height: 2.2em;
}

html, body {
  height: 100%;
}

h1 {
  font-size: 100px;
  line-height: 1em;
}

table {
  width: 100%;
  height: 100%;
  border: 0;
}

.none {
  width: 100%;
  height: 700px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  color: #292929;
}
</style>

<script>

export default {
  name: '404',
  data() {
    return {
      "code": "",
      "msg": "",
      "goto_time": 5,
      "show_go_back": false
    }
  },
  created() {
    this.code = this.$route.query.code
    this.msg = this.$route.query.msg

    if (this.msg != '域名没有认证商户') {
      this.show_go_back = true
      this.back_int = setInterval(this.goto_back, 1000)
    }
  },
  methods: {
    goto_back() {
      this.goto_time = this.goto_time -1
      if (this.goto_time <= 0) {
        clearInterval(this.back_int)

        this.$router.back()
      }
    },
    go_index() {
      clearInterval(this.back_int)
      this.$router.push({path: "/home"})
    }
  }
}
</script>
